@bg-color: #31a0e1;
@bg-color-active: #0581ca;
@bg-color-btn: #4095e4;
@bg-color-btn-info: #1ebb90;
@btn-color-active: #3f9cd2;
@font-color-active: #249af4;
@font-color-succ: #0b88d8;
@font-color-danger: #ff6f6f;

ul{margin-bottom: 0;}
.afterbg, .beforebg{content: '';position: absolute;display: block;width: 1px;height: 16px;background-color: #e2e2e2;top: 50%;margin-top: -8px;right: 0;}
.beforebg{right: auto;left: 0}
.ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
i{font-style: inherit;}

.ml10{margin-left: 10px;}
.loading-container {width: inherit;text-align: center;}
.tips-box {width: 100%;text-align: center;}

.changeColor{color:#ff5722;}
.font-active{color: @font-color-active;}
.flex-btn-line{display: flex;flex-wrap: wrap;
  .ant-btn{margin: 5px 10px 5px 0;}
}
/* */
.page-main {
  height: 100vh;
  background: #f5f5f5;
  .banner {
    height: 80px;
    background-image: url(../company-top.png);
    background-position: center;
    display: flex;
    align-items: center;
    > span {
      font-size: 24px;
      font-weight: bold;
      color: #fff;
      padding-left: 125px;
    }
  }
  .head-content, .hte-head-content {
    display: flex;
    align-items: center;
    background: #fff;
    padding: 16px 26px;
    border: solid 1px #e2e2e2;
    > span {font-size: 18px;color: #333;font-weight: 600;min-width: 100px;
      &:before {&:extend(.beforebg);}
    }
    >em{
      font-style: inherit;color: #9b9b9b;
    }
    > button {float: right;top: 17px;}
    .btn-line {flex: 1;display: flex;justify-content: flex-end;
      button{margin-right: 10px;
        &:last-of-type{margin-right: 0;}
      }
    }
    ul {color: #666;padding: 0;margin-left: 20px;
      li {padding: 0 14px;position: relative;display: inline-block;cursor: pointer;color: @font-color-active;
        span {margin-right: 2px;}
        &:before {
          &:extend(.beforebg);
        }
        &.active {
          color: @font-color-active;
        }
      }
    }
  }
  .container {padding: 25px 125px 100px;background: #f5f5f5;
    > .content{margin-top: 20px;}
    .content-admin{background: #ffffff;margin-top:  20px;padding: 16px 26px;}
    .header {
      .tab-span {background-color: @bg-color;color: #fff;border-radius: 2px;
        span {padding: 0 38px;display: inline-block;height: 38px;line-height: 38px;cursor: pointer;   transition: all .3s;     
          &.active {background-color: @bg-color-active;}
          &:hover{background-color: #0f91de;}
        }
      }
      .input-ground{display: flex; justify-content: space-between;align-items: center;
        .ant-input-group.ant-input-group-compact{display: flex;}
        button{margin-left: 10px;}
        /deep/ span.ant-radio + *{padding: 0;}
      }
    }
    ul.left {list-style: none;margin: 0;display: flex;align-items: center;}
    .cascade {
      background: #fff;
      border: 1px solid #ededed;
      color: #000;
      margin: 0px 0 25px 0;
      .projec-class-box {
        font-weight: 600;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        border-bottom: 1px solid #f2f2f2;
        .projec-class-lable {          
          text-align: right;
          font-family: SimHei;
          font-size: 16px;
          color: #333333;
          min-width: 119px;
          &.m120{
            padding: 10px 5px 10px 10px;
            min-width: 108px;
            text-align: right;
          }
        }
        .projec-class-list {
          color: #333333;
          font-size: 14px;
          display: block;
          position: relative;
          padding: 0;
          font-weight: inherit;
          li {
            float: left;
          }
        }
        &:last-child{
          border-bottom: none;
        }
      }
      ul {list-style: none;margin: 0;display: flex;align-items: center;font-weight: 600;
        li {padding: 10px 15px;}
      }      
      &.mb20{
        margin-bottom: 20px;
      }      
    }
    .hoverShow {cursor: pointer;border-bottom: 3px solid rgba(255, 255, 255, 0);      
      &:hover {border-bottom: 3px solid @btn-color-active;}
      &.active {color: @btn-color-active;border-bottom: 3px solid @btn-color-active;}
      &.clickShow{border-bottom: 3px solid @btn-color-active;}
    }
    section{
      padding: 30px;
      background: #fff;
      margin-bottom: 15px;
      border: solid 1px #e2e2e2;
      .section-header {
        font-size: 16px;
        font-weight: bold;
        position: relative;
        padding-left: 14px;
        color: #333333;
        margin-bottom: 14px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        em{font-style: inherit;color: #ff745d;font-size: 14px;}
        &:before {
          &:extend(.afterbg);
          width: 3px;
          left: 0;
          background-color: #47a4fa;
          border-radius: 1px;
        }
        .btn-line {flex: 1;display: flex;justify-content: flex-end;
          button{margin-right: 10px;
            &:last-of-type{margin-right: 0;}
          }
        }
      }
      .section-table{margin-top: 20px;
        .add-btn, >div>button {
          margin-bottom: 10px;
        }      
        >div>button {margin-right: 10px;}  
      }
      &.section-list{padding: 0;margin: 12px 0;color: #333;
        .list-head{background-color: #d9dee8;font-weight: bold;padding: 7px 18px;display: flex;align-items: center;
          >i{padding: 5px 7px;font-size: 12px;color: #fff;background-color: #b3b3b3;border-radius: 2px;margin-right:18px;
            &.i-status0 {background-color: @bg-color-btn;}
            &.i-status1 {background-color: #3eb177;}
            &.i-status2 {background-color: #2d2b91;}
            &.i-status3 {background-color: @bg-color-btn;}
          }
          .title{flex: 1;&:extend(.ellipsis);
            i{margin-right: 10px;color: @font-color-active;}
          }
          >span:last-child{
            span {font-weight: initial;color: #333;padding-left: 25px;font-weight: bold;
              i {color: #666;}
            }
          }
        }
        .list-content{padding: 15px 18px 5px 18px;
          .flex-line-box{display: flex;margin-bottom:10px;
            >div{display: flex;align-items: center;
              >div{margin-left: 15px;
                i{color: #666;padding-left: 5px;}
                &:first-of-type{margin-left: 0;}
              }
              .line-after{position: relative;padding-right:15px;
                &:after {
                  &:extend(.afterbg);
                }
              }
            }
            .line-fir{flex: 1;}
            .line-icon{color:#666;
              >div{cursor: pointer;
                .anticon, .iconfont{color: #77b9f1;font-size: 15px;}
                &:hover{opacity: 0.8;}
              }
            }
          }         
        }
      }
    }
  }
  .hte-btn {
    height: 30px;
    line-height: 30px;
    min-width: 80px;
    border-radius: 2px;
    margin: 0 10px 0 0;
    border: solid 1px #d9d9d9;
    padding: 0 10px;
    &.add-btn {border: solid 1px @bg-color-btn;background-color: @bg-color-btn;color: #fff;}
    &.info-btn {color: #fff;border: solid 1px @bg-color-btn-info;background-color: @bg-color-btn-info;}
    &.danger-btn {color: #fff;border: solid 1px @font-color-danger;background-color: @font-color-danger;}
    &.warn-btn {color: #fff;border: solid 1px #E6A23C;background-color: #E6A23C;}
    &:last-child{margin-right: 0;}
    &.add-btn,&.info-btn, &.danger-btn,&.warn-btn{
      &:hover{opacity: 0.8;}
    }    
  }
  /deep/ .ant-btn > .anticon + span{margin-left: 3px;}
  .floatNav {position: fixed;right: 19px;top: 215px;z-index:2;
    >div{border: 1px solid #e2e2e2;border-top: none;display: flex;flex-direction: column;align-items: center;padding: 15px 10px;cursor: pointer;background-color: #fff;
      img {margin-bottom: 5px;}
      span {color: #6cb299;}
      p {margin: 0;color: #595959;}
      &:hover{opacity: 0.8;}      
      &:first-of-type{border-top: 1px solid #e2e2e2;}
    }
  }
}
.btn-bottom-fixed{position: fixed;bottom: 15px;text-align: center;width: 100%;left:0;z-index:1;}
.btn-left-fixed{
  position: fixed; top: 180px; left: 10px;z-index: 1;
  >button{display: block;margin-bottom: 10px;}
}
/* 搜索更多 */
.btn-more{display: none;}
.project-class-more{padding-right: 63px;position: relative;
  .btn-more{display: inline-block;position: absolute;right: 10px;top: 11px;padding: 0px 5px;cursor: pointer;color: #999;font-weight: normal;
    &:hover{color: #0581ca;background-color: #e4e4e4;
      .icon-child-down{color: #0581ca;}
    }
  }
  ul{-webkit-transition: all .3s;transition: all .3s;overflow: hidden;max-height: 700px;
    &.projec-class-list-more{max-height: 43px;}
  }
} 
.icon-child-down{font-size: 11px;margin-left: 3px;transition: all .3s;color: #999;
  &.icon-child-up{transform: rotate(180deg);}
}

/* form */
/deep/ .ant-form {
  .col-input-2 {
    .ant-select, .ant-input-number, .ant-input {width: 49%;
      &:first-child {margin-right: 2%;}
    }
    input {width: 49%;}
    &.col-input-font .ant-select-selection-selected-value {color: #de2626;}
    .ant-input-number div input {width: 100%;}
  }
  .ant-form-item:not(.self-form-item){
    .ant-form-item-label{width: 137px;}
    .ant-form-item-control-wrapper{display: inline-block;width: calc(100% - 137px);}
  }
  .ant-form-item-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .slot-label{
    .ant-form-item-label{padding-right: 13px;line-height: 29px;height: 40px;
      > label{
        &:after{display: none;}
        p{line-height: 0;
          &:nth-child(2){line-height: 0.8;}
        }
      }
    } 
  }


  .disable-input-bg .ant-col .ant-form-item-control .ant-form-item-children{
    display: inline-block;width: 100%;height: 32px;line-height: 1.5;background-color: #f2f2f2;border: 1px solid #f2f2f2;
    margin: 0;font-variant: tabular-nums;list-style: none;font-feature-settings: 'tnum';position: relative;padding: 4px 11px;font-size: 14px;background-image: none;border-radius: 4px;transition: all 0.3s;color: #787878;cursor: not-allowed;
  }
  .ant-form-explain, .ant-form-extra{min-height: 13px;font-size: 12px;line-height: 1;margin-top: -1px;}
  .ant-form-item{margin-bottom: 0px;display: flex;}
  .ant-input.ant-input-disabled, .ant-select-disabled .ant-select-selection, .ant-col .disabled-radio{border:1px solid #f2f2f2;background-color: #f2f2f2;}
  .ant-col .disabled-radio{margin: 0;display: inline-block;width: 100%;height: 32px;padding: 4px 11px;font-size: 14px;line-height: 1.5;border-radius: 4px;transition: all 0.3s;}
  .ant-select-disabled, .ant-input[disabled],.ant-radio-disabled + span{color: #787878;}  
  textarea.ant-input{margin-top: 4px;}  
  .ant-calendar-picker{width: 100%}
  @media (max-width: 1350px) {
    .ant-row{
      .ant-form-item{display: block;}
      .ant-form-item-label,div.ant-col.ant-form-item-control-wrapper {width: 100% !important;}
      .ant-form-item-label {line-height: 1.4;text-align: left;}   
      .slot-label{
        .ant-form-item-label{
          > label{
            p{display: inline-block;}
          }
        } 
      }
    }
    .hte-col-nowrap{
      .ant-form-item{display: flex;}
      .ant-form-item-label,div.ant-col.ant-form-item-control-wrapper {width: auto !important;}
      .ant-form-item-label {line-height: 32px;text-align: right;}   
    }
  }
}

/* table */
/deep/ .ant-table {
  .ant-table-body, .ant-table-body::-webkit-scrollbar-track {background-color: #fff;}
  .ant-table table, .ant-table-small, .ant-table-thead > tr > th {border: 0 ;border-radius: 0;}
  .ant-table.ant-table-bordered table, .ant-table-small.ant-table-bordered, .ant-table-bordered table .ant-table-thead > tr > th {
    border-left: 1px solid #e8e8e8;border-radius: 0;
  }
  .ant-table-thead, .ant-table-thead > tr > th {background-color: #d9dee8;}
  .ant-table-small > .ant-table-content > .ant-table-body {margin: 0;border: 0;}
  .ant-table-thead > tr:first-child > th:last-child{border-top-right-radius: 0;}  
  textarea.ant-input{margin: 0;}
  .ant-table-tbody .ant-table-row td{padding: 10px 8px !important;}
  .ant-table-tbody .ant-table-row td input{padding: 0px 11px !important;height: 25px !important;}
  .ant-table-tbody .ant-table-row td .ant-input-number{height: 25px !important;}
}
.hte-table-headchild{
  // /deep/ .ant-table-thead tr{
  //   th{border-bottom: 1px solid #bfbfbf;
  //     &:first-of-type{border-right: 1px solid #bfbfbf;}    
  //   }
  // }
  // /deep/.ant-table-bordered .ant-table-thead > tr > th, .ant-table-bordered .ant-table-tbody > tr > td{
  //   border-right: 1px solid #bfbfbf;
  // }
  /deep/.ant-table-thead > tr > th{
    border: 1px solid #E4E7ED;
  }
}
/deep/ .el-upload__input{display: none !important;}
/* 后台 */

.page-main-admin /deep/ .ant-card-body {
  padding: 0;
}
.page-main-admin .hte-col-nowrap /deep/ .ant-col{
    margin-bottom: 8px;
}
@media (max-width: 1080px){
  .page-main .banner > span{padding-left: 30px;}
  .page-main .container{padding: 25px 30px 100px !important}
}